<template>
  <div class="search">
    <div class="block">
    <span class="demonstration">订单时间</span>
    <el-date-picker
      v-model="value1"
      type="daterange"
      range-separator="-"
      start-placeholder="2022-6-27"
      end-placeholder="2020-6-27">
    </el-date-picker>
  </div>

<el-form :inline="true" :model="formInline" class="demo-form-inline">
 <span class="demonstration">订单类型</span>
    <el-select v-model="formInline.region" placeholder="全部">
      <el-option label="全部" value="shanghai"></el-option>
      <el-option label="处方开立" value="beijing"></el-option>
    </el-select>
</el-form>

    <div class="left-title">
         <el-input
            placeholder="请输入用户名"
            v-model="search"
            clearable>
        </el-input>
        <!-- 点击搜索 -->
        <el-button type="primary" @click="searchfun">
            <i class="el-icon-search"></i>
        </el-button>
    </div>

  </div>
</template>

<script>
export default {
   data() {
      return {
        search:'',//搜索的值
        formInline: {
          region: ''
        },
        value1: '',
      }
    },
    methods: {
      onSubmit() {
        console.log('submit!');
      },
      searchfun(){//点击搜索按钮
      this.$emit('searchfunparent',this.search)
      }
    }
}
</script>

<style lang="less" scoped>
.search {
    height: 100px;
    display: flex;
    align-items: center;

.el-date-editor--daterange.el-input__inner {
    width: 210px;
    margin-right: 30px;
}
.demonstration {
    margin-left: 30px;
    margin-right: 10px;
}
.left-title {
    width: 360px;
    display: flex;
    justify-content: space-between;

/deep/.el-input__inner {
  width: 360px;
  border: 2px solid #5a6bef;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-right: 0;
  margin-left: 50px;
}
.el-button--primary {
  background-color: #5a6bef;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  margin-left: 50px;
}
.el-button {
    padding: 6px 20px;
}
.el-icon-search {
    font-size: 25px;
  }

}
}


   

</style>